<?php
/*
 * DONE: Change the JQuery into CDN mode
 */
//echo $this->doctype();

?>
<!DOCTYPE HTML>
<html>
	<head>
            <title>Whatever</title>
            <meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
            <link rel="stylesheet" href="/css/main_new.css">
            <link rel="stylesheet" href="/css/redmond/jquery-ui-1.8.11.custom.css">
            <script type="text/javascript" src="/js/jquery-ui-1.8.11.custom.min.js"></script>
            <script type="text/javascript" type="text/javascript" src="/js/jquery-1.5.1.min.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.core.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.widget.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.position.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.autocomplete.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.button.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.resizble.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.mouse.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.draggable.js"></script>
            <script type="text/javascript" src="/js/ui/jquery.ui.dialog.js"></script>
            
        </head>
        <style>
          .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
        </style>
<script type="text/javascript">
    //
    $(function(){$( "button,input:submit" ).button();});
    function initHAC(){
    try{
        $("#location_ac").autocomplete("destroy");
        if ($('#ac').val() == ' Enter search...') {$('#ac').val('');}
        $('#ac').css({'color':'black'});
    //  alert('init autocomplete!');
        $( "#ac" ).autocomplete({
                source: "/search/hac",
                minLength: 1
        });
    }
    catch (e) {alert(e);}
    }
    function destroyHAC(){
        if ($("#ac").val() == '') {$("#ac").val(' Enter search...');}
        $('#ac').css({'color':'grey'});
       

    }
    //auto complete
    var f_list1=" <article class='round_edge_10px block'>";
    var f_list2="</article>";
    function head_search(){
        $.post("/search/searchusers", {ac:$("#ac").val()},
        function(data){
            var content="";
            for(i=0;i<data.length;i++){
                var friends_field=f_list1+"<p>"+data[i].name+"</p>"+"<a href='javascript:{addfriendaction("+data[i].id+");}'>Add a friend</a>"+f_list2;
                content+=friends_field;
            }
            $('#content').empty().append("<h3>Search People Result</h3>"+content);
        }
        ,'json')
    }
    function addfriendaction(id){

        $( "#dialog:ui-dialog" ).dialog( "destroy" );
        $( "#dialog-confirm" ).dialog({
                resizable: false,
                height:200,
                modal: true,
                buttons: {
                        "Send": function() {
//                            alert(user_id+'in del');
                                $.ajax({
                                    type:'POST',
                                    url:'/friends/addfriends    ',
                                    data:{'target_id':id,'':$("#add_friend_dialog textarea").val()},
                                    success:function (data){
                                        alert(data);
                                        $( this ).dialog( "close" );
                                        location.reload();
                                    },
                                    dataType:'json'
                                });
                                $( this ).dialog( "close" );
                        },
                        Cancel: function() {
                                $( this ).dialog( "close" );
                        }
                }
        });
    }

</script>
<div id="dialog-confirm" title="Add a friend" style="display:none;">
	<p> Say some thing and ask for permission:</p>
        <div id="add_friend_dialog"><textarea></textarea></div>
            
</div>